<template>
	<view>
		<!-- 居中弹出 -->
		<gui-popup ref="guipopup" width="504" @close="closeEvent">
			<view class="popup_warp">
				<view class="con gui-flex gui-column gui-justify-content-center gui-align-items-center">
					<image v-if="imgType" class="msg_img" src="@/static/image/msg_success.png" mode="aspectFit"></image>
					<image v-if="!imgType" class="msg_img" src="@/static/image/wyzh.png" mode="aspectFit"></image>
					<view class="msg f32" v-if="btnShow">
						{{msg}}
					</view>
					<view class="msg f32" style="text-align: center;" v-else>
						<view>
							未有账号？
						</view>
						<view>
							请联系相关管理人员
						</view>
					</view>
					<button v-if="btnShow" class="btn" @tap.stop="close">{{btnMsg}}</button>
				</view>
				<!-- 关闭按钮 -->
				<text class="gui-block-text demo-close gui-icons gui-absolute-rt" @tap.stop="close">&#xe78a;</text>
			</view>
		</gui-popup>
	</view>
</template>

<script>
	export default {
		name: "bai-msg",
		props: {
			imgType: {
				type: Boolean,
				default: true
			},
			msg: {
				type: String,
				default: '密码修改成功'
			},
			btnShow: {
				type: Boolean,
				default: true
			},
			btnMsg: {
				type: String,
				default: '去登录'
			}
		},
		data() {
			return {

			};
		},
		methods: {
			//01 居中弹出
			open: function() {
				this.$refs.guipopup.open();
			},
			closeEvent: function() {
				this.$emit('close');
			},
			close: function() {
				this.$emit('close');
				this.$refs.guipopup.close();
			},
		}
	}
</script>

<style scoped>
	.popup_warp {
		background-color: #fff;
		width: 504rpx;
		min-height: 407rpx;
		border-radius: 20rpx;
		padding-top: 74rpx;
	}

	.msg_img {
		width: 95rpx;
		height: 101rpx;
	}

	.msg {
		color: rgba(0, 0, 0, 0.65);
		margin-top: 30rpx;
	}

	.btn {
		margin-top: 34rpx;
		width: 249rpx;
		height: 67rpx;
		background: linear-gradient(180deg, #1890FF 0%, #0A60FF 100%);
		border-radius: 50rpx;
		color: #fff;
		font-size: 28rpx;
		line-height: 67rpx;
	}

	.demo-close {
		top: 20rpx;
		right: 20rpx;
		color: #333333;
		font-size: 40rpx;
	}
</style>